/* ==========================================================================
   1. الهيدر الزجاجي الأبيض النحيف والذكي جداً (Slim & Compact Glass Header)
   ========================================================================== */
.sticky-header {
    position: fixed !important;
    top: 10px !important; 
    left: 5% !important;
    width: 90% !important;
    z-index: 9999 !important;
    
    /* تقليل الارتفاع الإجمالي وضبط الهوامش الداخلية للكبسولة */
    padding: 2px 20px !important; 
    height: 55px !important; 
    min-height: 55px !important;
    max-height: 55px !important;
    
    /* تأثير الزجاج الشفاف */
    background-color: rgba(255, 255, 255, 0.75) !important; 
    backdrop-filter: blur(10px) !important; 
    -webkit-backdrop-filter: blur(10px) !important;
    
    border: 1px solid rgba(255, 255, 255, 0.4) !important;
    box-shadow: 0 4px 15px rgba(0, 0, 0, 0.05) !important;
    border-radius: 50px !important;
    transition: all 0.3s ease !important;
}

/* ==========================================================================
   2. تنحيف العناصر الداخلية وإجبارها على المحاذاة العمودية والتوسط
   ========================================================================== */
.sticky-header > div, 
.sticky-header [class*="theme-container"],
.sticky-header [class*="row"] {
    padding-top: 0 !important;
    padding-bottom: 0 !important;
    margin-top: 0 !important;
    margin-bottom: 0 !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: space-between !important;
}

/* ضبط حجم اللوجو */
.sticky-header img, 
.sticky-header [class*="logo"] img {
    max-height: 32px !important; 
    width: auto !important;
    object-fit: contain !important;
    margin: 0 !important;
}

/* ضبط زر القائمة وزر اللغة */
.sticky-header [class*="nav"],
.sticky-header [class*="menu"],
.sticky-header [class*="lang"] {
    margin: 0 !important;
    padding: 0 !important;
    display: inline-flex !important;
    align-items: center !important;
}

/* ==========================================================================
   3. إعدادات نسخة الجوال
   ========================================================================== */
@media (max-width: 768px) {
    .sticky-header {
        top: 8px !important;
        left: 2% !important;
        width: 96% !important;
        height: 50px !important; 
        min-height: 50px !important;
        max-height: 50px !important;
        padding: 2px 12px !important;
    }
    
    .sticky-header img, 
    .sticky-header [class*="logo"] img {
        max-height: 28px !important;
    }
}

/* ==========================================================================
   4. تقليل المساحة البيضاء بين الهيدر والسيكشن الأول (تم تقريبها هنا)
   ========================================================================== */
body > div:first-of-type, 
main > section:first-of-type,
#page-wrapper > section:first-of-type {
    padding-top: 90px !important; /* تم تقليلها من 140px لتقريب السيكشن من الهيدر */
}

@media (max-width: 768px) {
    body > div:first-of-type, 
    main > section:first-of-type,
    #page-wrapper > section:first-of-type {
        padding-top: 80px !important; /* تقليل المسافة في الجوال أيضاً ليكون متناسقاً */
    }
}